<template>
    <div>
        <el-form label-width="120px" :model="AddAuditRuleDB" ref="AddAuditRuleDBref">
            <el-row>
                <el-col :offset="2" :span="9">
                    <el-form-item label="菜单模块" prop="ModuleNumber">
                        <el-select required placeholder="请选择类型" v-model="AddAuditRuleDB.ModuleNumber">
                            <el-option :value="0" label="请选择类型">请选择类型</el-option>
                            <el-option value="020200" label="支付管理">支付管理</el-option>
                            <el-option value="020300" label="报销管理">报销管理</el-option>
                            <el-option value="020400" label="开票管理">开票管理</el-option>
                            <el-option value="030200" label="申购列表">申购列表</el-option>
                            <el-option value="030100" label="采购列表">采购列表</el-option>
                            <el-option value="050600" label="入库单">入库单  </el-option>
                            <el-option value="050700" label="出库单">出库单  </el-option>
                            <el-option value="051000" label="归还单">归还单  </el-option>
                            <el-option value="160200" label="公章审核单">公章审核单  </el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
            </el-row>

            <el-row>
                <el-col :offset="2" :span="9">
                    <el-form-item label="发起人" prop="SponsorUser">
                        <el-select width="100%" v-model="AddAuditRuleDB.SponsorUser" multiple filterable placeholder="请选择发起人" style="width:100%">
                            <el-option value="">发起人</el-option>
                            <el-option v-for="(v,k) in AllUsers" :value="v.Id" :data-userid="v.Id" :label="v.UserName" v-text="v.UserName" />
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :offset="2" :span="9">
                    <el-form-item label="发起部门" prop="SponsorDepart">
                        <el-select v-model="AddAuditRuleDB.SponsorDepart" multiple required placeholder="请选择部门" style="width:100%">
                            <el-option value="">请选择部门</el-option>
                            <el-option v-for="(v,k) in AllDepartment" :value="v.Id" :data-userid="v.Id" :label="v.DepartmentName" v-text="v.DepartmentName" />
                        </el-select>
                    </el-form-item>
                </el-col>
            </el-row>

            <el-row>
                <el-col :offset="2" :span="9">
                    <el-form-item label="第一审批人" prop="AuditUserId1">
                        <el-select width="100%" v-model="AddAuditRuleDB.AuditUserId1" filterable placeholder="第一审批人" style="width:100%">
                            <el-option :value="0" label="请选择第一审批人">请选择第一审批人</el-option>
                            <el-option v-for="(v,k) in AllUsers" :value="v.Id" :data-userid="v.Id" :label="v.UserName" v-text="v.UserName" />
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :offset="2" :span="9">
                    <el-form-item label="第二审批人"  prop="AuditUserId2">
                        <el-select width="100%" v-model="AddAuditRuleDB.AuditUserId2" filterable placeholder="第二审批人" style="width:100%">
                            <el-option :value="0" label="请选择第二审批人">请选择第二审批人</el-option>
                            <el-option v-for="(v,k) in AllUsers" :value="v.Id" :data-userid="v.Id" :label="v.UserName" v-text="v.UserName" />
                        </el-select>
                    </el-form-item>
                </el-col>
            </el-row>


            <el-row>
                <el-col :offset="2" :span="9">
                    <el-form-item label="第三审批人"  prop="AuditUserId3">
                        <el-select width="100%" v-model="AddAuditRuleDB.AuditUserId3" filterable placeholder="第三审批人" style="width:100%">
                            <el-option :value="0" label="请选择第三审批人">请选择第三审批人</el-option>
                            <el-option v-for="(v,k) in AllUsers" :value="v.Id" :data-userid="v.Id" :label="v.UserName" v-text="v.UserName" />
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :offset="2" :span="9">
                    <el-form-item label="第四审批人"   prop="AuditUserId4"> 
                        <el-select width="100%" v-model="AddAuditRuleDB.AuditUserId4" filterable placeholder="第四审批人" style="width:100%">
                            <el-option :value="0" label="请选择第四审批人">请选择第四审批人</el-option>
                            <el-option v-for="(v,k) in AllUsers" :value="v.Id" :data-userid="v.Id" :label="v.UserName" v-text="v.UserName" />
                        </el-select>
                    </el-form-item>
                </el-col>
            </el-row>


            <el-row>
                <el-col :offset="2" :span="9">
                    <el-form-item label="第五审批人" prop="AuditUserId5">
                        <el-select width="100%" v-model="AddAuditRuleDB.AuditUserId5" filterable placeholder="第五审批人" style="width:100%">
                            <el-option :value="0" label="请选择第五审批人">请选择第五审批人</el-option>
                            <el-option v-for="(v,k) in AllUsers" :value="v.Id" :data-userid="v.Id" :label="v.UserName" v-text="v.UserName" />
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :offset="2" :span="9">
                    <el-form-item label="第六审批人" prop="AuditUserId6">
                        <el-select width="100%" v-model="AddAuditRuleDB.AuditUserId6" filterable placeholder="第六审批人" style="width:100%">
                            <el-option :value="0" label="请选择第六审批人">请选择第六审批人</el-option>
                            <el-option v-for="(v,k) in AllUsers" :value="v.Id" :data-userid="v.Id" :label="v.UserName" v-text="v.UserName" />
                        </el-select>
                    </el-form-item>
                </el-col>
            </el-row>



            <el-row>
                <el-col :offset="2" :span="20">
                    <el-form-item label="抄送人"  prop="CCPerson">
                        <el-select width="100%" v-model="AddAuditRuleDB.CCPerson" multiple filterable placeholder="第一审批人" style="width:100%">
                            <el-option v-for="(v,k) in AllUsers" :value="v.Id" :data-userid="v.Id" :label="v.UserName" v-text="v.UserName" />
                        </el-select>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row :gutter="20" style="text-align: center">
                <el-button type="success" @click="SaveAuditRule()">确定</el-button>
            </el-row>
        </el-form>

    </div>
</template>

<script>

    export default {
        name: "AddAuditRule",
        props: {
            AllUsers: {
                type: Array,
                required: true
            },
            AllDepartment: {
                type: Array,
                required: true
            },
        },
        created() {

        },
        data() {
            return {
                AddAuditRuleDB: {
                    SponsorUser: '',
                    SponsorDepart: '',
                    CCPerson: '',
                    ModuleNumber: 0,
                    AuditUserId2: 0,
                    AuditUserId1: 0,
                    AuditUserId3: 0,
                    AuditUserId5: 0,
                    AuditUserId4: 0,
                    AuditUserId6: 0,
                },
            }
        },
        methods: {
            SaveAuditRule() {
                this.AddAuditRuleDB.SponsorUser = this.AddAuditRuleDB.SponsorUser.join(',');
                this.AddAuditRuleDB.SponsorDepart = this.AddAuditRuleDB.SponsorDepart.join(',');
                this.AddAuditRuleDB.CCPerson = this.AddAuditRuleDB.CCPerson.join(',');
                this.$http.post("/Right/AddAuditRule", { AddAuditRuleDB: this.AddAuditRuleDB }).then(res => {
                    console.log(res)
                    if (res.data.IsSuccess) {
                        this.$message.success(res.data.Msg);
                        this.$parent.$parent.AddAuditRuleShow = false;
                        this.$parent.$parent.GetAuditRuleDetail();
                        this.$refs["AddAuditRuleDBref"].resetFields();
                    }
                    else {
                        this.$message.error(res.data.Msg);
                    }
                });
            },
        },
    }
</script>

<style scoped>
    .el-table th {
        padding: 0px;
    }

    .el-select-dropdown__item {
        width: 270px !important;
    }
</style>
